<template>
    <!-- 添加或修改碳排放因子数据库对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body :close-on-click-modal="false" custom-class="show-back-class">
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="分类" prop="categorizeCode">
          <el-cascader  v-model="categorizeCodeArr" style="width: 100%"
                        :options="$store.state.factorDict.categorizeTreeDict1"
                        :props="{value:'idStr',label:'chineseName',children:'children'}"
                        clearable></el-cascader>
        </el-form-item>
          <el-row >
            <el-col :xs="24" :sm="24" :lg="24"  >
            <el-form-item label="上游排放" prop="upstreamEmissions">
              <el-input v-model="form.upstreamEmissions" placeholder="请输入上游排放" style="width: 60%"/>
              <el-input v-model="form.upstreamUnit" placeholder="排放单位" style="width: 40%"/>
              <el-form-item label="" prop="upstreamUnit"/>
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="24" :lg="24"  >
            <el-form-item label="下游排放" prop="downstreamEmissions">
              <el-input v-model="form.downstreamEmissions" placeholder="请输入下游排放" style="width: 60%"/>
              <el-input v-model="form.downstreamUnit" placeholder="排放单位" style="width: 40%"/>
              <el-form-item label="" prop="downstreamUnit"/>
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="24" :lg="24"  >
            <el-form-item label="参考文献" prop="dataSource">
              <el-input type="textarea" :rows="6" v-model="form.dataSource" placeholder="请输入参考文献/数据来源" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="24" :lg="24"  >
            <el-form-item label="文献/简化" prop="dataSourceSimplified">
              <el-input type="textarea" :rows="3" v-model="form.dataSourceSimplified" placeholder="请输入参考文献/简化" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="24" :lg="24"  >
            <el-form-item label="负责人" prop="principal">
              <el-input v-model="form.principal" placeholder="请输入负责人" />
            </el-form-item>
            </el-col>
          <el-col :xs="24" :sm="24" :lg="12"  >
            <el-form-item label="排序" prop="orderNum" >
              <el-input v-model="form.orderNum" placeholder="请输入排序" @blur="verifyNumDefault(form,'orderNum',0,null)"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :lg="12"  >
            <el-form-item label="状态" prop="status" style="margin-bottom: 0">
              <el-radio-group v-model="form.status">
                <el-radio v-for="dict in $store.state.factorDict.statusOptions"
                          :key="dict.dictValue" :label="dict.dictValue">{{dict.dictLabel}}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
</template>

<script>
import { listCarbonFactorInfo, getCarbonFactorInfo, delCarbonFactorInfo, saveCarbonFactorInfo } from "@/api/factor/carbonFactorInfo";

export default {
  name: "CarbonFactorInfo",
  data() {
    return {
      categorizeCodeArr: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 表单参数
      form: {},
      // 表单校验
      rules: {
      }
    };
  },
  created() {

  },
  methods: {
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        categorizeCode: null,
        upstreamEmissions: null,
        upstreamUnit: null,
        downstreamEmissions: null,
        downstreamUnit: null,
        dataSource: null,
        dataSourceSimplified: null,
        principal: null,
        status: 1,
        orderNum: null,
        createBy: null,
        createTime: null,
        updateBy: null,
        updateTime: null
      };
      this.resetForm("form");
      this.categorizeCodeArr=[];
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加碳排放因子数据库";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      getCarbonFactorInfo(row.id).then(response => {
        if(response.data.categorizeCode){
          this.categorizeCodeArr = response.data.categorizeCode.split(",");
        }
        this.form = response.data;
        this.open = true;
        this.title = "修改碳排放因子数据库";
      });
    },
    /** 提交按钮 */
    submitForm() {
      if(this.categorizeCodeArr.length>0){
        this.form.categorizeCode = this.categorizeCodeArr.join(",");
      }else {
        this.form.categorizeCode = '';
      }
      this.$refs["form"].validate(valid => {
        if (valid) {
            saveCarbonFactorInfo(this.form).then(response => {
              if (response.code === '200') {
                this.msgSuccess("保存成功");
                this.open = false;
                this.$emit("getList");
              }
            });
        }
      });
    },

  }
};
</script>
